<template>
  <Layout style="background:#fff;">
    <Row>
      <Col span="24">
      <Card v-if="showContent" dis-hover :bordered="false" title="设备基本信息" icon="ios-options" :padding="0">
        <NoPowerContent v-if="isNoPower" :isDtu="isDtu" :row="row" :collectTypeList="collectTypeList" @afterSave="handelInit" />
        <PowerContent v-if="!isNoPower" :isDtu="isDtu" :row="row" :collectTypeList="collectTypeList" @afterSave="handelInit" />
      </Card>
      </Col>
    </Row>
  </Layout>
</template>
<script>
import NoPowerContent from "../components/NoPowerContent"
import PowerContent from "../components/PowerContent"
import { getDeviceDetail, getGatewayType } from "@/api"
export default {
  components: {
    NoPowerContent,
    PowerContent
  },
  mounted() {
    this.initState()
    this.getCollectTypeList()
  },
  data() {
    return {
      row: {},
      complete: false,
      isDtu: false,
      collectTypeList: [],
      isNoPower: false,
      showContent:false,
    }
  },
  methods: {
    initState() {
      const params = this.$route.params
      getDeviceDetail(params.id).then(res => {
        if (res.code === 200) {
          this.row = res.data
          const collectType = this.row.collectType
          const transformerStructure = this.row.transformerStructure
          if (collectType === 1 || collectType === 2) {
            this.isDtu = false
          } else {
            this.isDtu = true
          }

          // 设备等级大于1 ，为配电结构企业
          if (transformerStructure) {

            this.isNoPower = false
          } else {
            this.isNoPower = true
          }
          this.showContent = true
        }
      })
    },
    getCollectTypeList() {
      getGatewayType().then(res => {
        this.collectTypeList = res.data
      })
    },
    handelInit() {
      this.initState()
      this.getCollectTypeList()
    }
  }
}
</script>
